<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE HTML>
<html style="height:100%;min-height: 580px;"><head>
  <title>荩美国际商城</title>
  <meta content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" name="viewport">
  <meta content="yes" name="apple-mobile-web-app-capable">
  <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
  <meta content="telephone=no" name="format-detection">
  <link href="/resources/frontcss/plugins.css" type="text/css" rel="prefetch stylesheet">
  <link href="/resources/frontcss/court_lxl.css" type="text/css" rel="prefetch stylesheet">
  <link href="/resources/frontcss/court_zl.css" type="text/css" rel="prefetch stylesheet">
  <link href="/resources/frontcss/court.css" type="text/css" rel="prefetch stylesheet">
  <link rel="prefetch stylesheet" type="text/css" href="/resources/frontcss/public.css"/>
  <style type="text/css">*{margin:0;padding:0;list-style-type:none;}
  .demo a,.demo img{border:0;}
  .demo a,.demo a:visited{color:#5e5e5e; text-decoration:none;}
  .demo a:hover{color:#b52725;text-decoration:none;}
  .demo .clear{display:block;overflow:hidden;clear:both;height:0;line-height:0;font-size:0;}
  .demo{width:100%;margin:0;border:solid 0 #ddd;padding:0 1px;}
  .demo h2{font-size:14px;color:#333;height:30px;line-height:30px;padding:0 0 15px 0;color:#3366cc;}
  .demo .txt_input{border:solid 1px #ddd;height: 100%;width: 70%;font-size:14px;}
  .demo .btn_input{border:solid 1px #ddd;padding:7px 8px;margin-left: 8px;}
  /* ranklist */.demo .ranklist{height:95%;min-height:350px;overflow:auto;}
  .demo .ranklist li{overflow:hidden;position:relative;padding:0 0 10px 0;margin:0 0 12px 0;}
  .demo .ranklist li .num{position:absolute;right:0;top:0;color:#999;font-size:14px;}

  .demo .spanspan{font-size:1.0rem;}
  </style></head>
<body style="height:98%;" class="">
<div style="height:100%;" class="">
  <div id="wft_ctn">
  <div class="court_zl" id="court_readA">
    <div class="content">
      <div class="read_con">
        <ul>

          <li id="courtQueryAndList">
            <div class="demo">
              <div class="ranklist">
                <form id="saveForm" method="post" action="/front/order/save">
                <ul style="">

                  <c:forEach items="${data}" var="e">
                        <li id="li_${e.id}">
                          <p>
                            <div style="width: 260px;">
                             <img src="${image}" style="width: 100px;height: 100px;">
                              <div style="float:right;">
                                ${e.name}
                                </br>
                                单价：<span id="price_${e.id}">${e.price}</span>元
                                数量:${e.num}</br>
                                总价：${e.totalPrice}元
                                <input type="hidden" name="id" value="${e.id}"/>
                                <input type="hidden" name="num" id="id_${e.id}" value="${e.num}"/>
                              </div>
                            </div>

                          </p>
                        </li>
                  </c:forEach>

                  <li>
                    待支付：<span id="totalMoney">${totalMoney}</span>
                  </li>
                  <li>
                   <input type="text" name="userName" placeholder="收货人" id="userName"/>
                  </li>
                  <li>
                    <input type="text" name="telephone" placeholder="联系电话" id="telephone"/>
                  </li>
                  <li>
                    所在省份：<select name="province" id="province" onchange="showCity()">
                             </select>
                    <input type="hidden" name="provinceName" id="provinceName"/>
                  </li>
                  <li>
                    所在地市：<select name="city" id="city" onchange="showArea()">
                  </select>
                    <input type="hidden" name="cityName" id="cityName"/>
                  </li>
                  <li>
                    所在区县：<select name="area" id="area" >
                  </select>
                    <input type="hidden" name="areaName" id="areaName"/>
                  </li>
                  <li>
                    <input type="text" name="address" placeholder="详细地址" id="address"/>
                  </li>
                  <li>
                    <input type="text" name="remark" placeholder="备注" id="remark"/>
                  </li>

                  <li>
                      <input type="button" value="提交订单" onclick="submitOrder()"/>
                  </li>
                </ul>
                  <input type="hidden" id="ids" name="ids"/>
                </form>
              </div>
            </div>

          </li>
        </ul>

      </div>

    </div>
  </div>
</div>
</div>
<script type="text/javascript">

  function submitOrder(){
    var ids = "";
    $("input[name='id']").each(function () {
      var id = $(this).val();
      var num = $("num_"+id).html();
      ids += id+"-"+num+",";
    })
    if(ids.length>0)
      ids = ids.substr(0,ids.length-1);
     $("#ids").val(ids);
    if($("#province").val()==""){
      alert("请选择省份！");
      return ;
    }
    $("#provinceName").val($("#province").find("option:selected").text());
    if($("#city").val()==""){
      alert("请选择省份！");
      return ;
    }
    $("#cityName").val($("#city").find("option:selected").text());
    if($("#area").val()==""){
      alert("请选择省份！");
      return ;
    }
    $("#areaName").val($("#area").find("option:selected").text());

     $("#saveForm").submit();
  }

</script>

</body>
</html>